import MyTitle from "@/components/MyTitle";
import React, { FC, useEffect, useRef, useCallback } from "react";
import { PlusOutlined } from '@ant-design/icons'
import { ModalForm, ProFormText } from "@ant-design/pro-components";
import { Button, Form, message, Dropdown, Space, Tag } from "antd";
import { ShowError } from "@/utils/message";
import { Ajax } from "@/api/api";

interface XuekeType {
    label: string;
    value: string;
}

const AddXuekeForm: FC<any> = ({
    children,
    actionRef,
    flag,
    open,
    setOpen,
    updateData
}) => {
    const [form] = Form.useForm<XuekeType>();
    const onCancel = useCallback(() => {
        form.resetFields()
        setOpen(false)
    }, [])

    useEffect(() => {
        form.setFieldValue(updateData)
    }, [updateData])
    return (
        <ModalForm<XuekeType>
            open={open}
            width={'30%'}
            title={flag ? "修改学科" : "添加学科"}
            form={form}
            autoFocusFirstInput
            modalProps={{
                destroyOnClose: true,
                onCancel: onCancel
            }}
            submitter={{
                searchConfig: {
                    submitText: flag ? '修改' : '添加',
                    resetText: '取消',
                },
            }}
            submitTimeout={2000}
            onFinish={async (values) => {
                if (flag) {
                    let params = {
                        ...values,
                        _id: updateData._id
                    }
                    let res = await Ajax.updatexueke(params) as any;
                    if (res.code == 200) {
                        actionRef.current.reload()
                        onCancel()
                    }
                } else {
                    let res = await Ajax.addxueke(values) as any;
                    if (res.code == 200) {
                        actionRef.current.reload()
                        onCancel()
                    }
                }

            }}
            onFinishFailed={() => ShowError('校验失败')}
        >
            <ProFormText
                name="label"
                label="学科名称"
                placeholder="请输入学科名称"
                rules={[
                    { required: true, message: '请输入' },
                ]}
            />

            <ProFormText
                name='value'
                label="学科编码"
                placeholder="请输入学科编码"
                rules={[
                    { required: true, message: '请输入' },
                ]}
            />
        </ModalForm>
    )
}

export default AddXuekeForm